section {
  margin-top: 60px;
  width: 100%;
  padding-top: 50px;
  padding-bottom: 50px;
  background-color: rgb(240, 240, 240);
}
section > div { 
  margin:auto;
  width: 85%;
}
section div .card {
  min-width: 1100px;
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
}
section div .card li {
  box-sizing: border-box;
  width: 350px;
  height: 350px;
  margin-top: 15px;
  margin-bottom: 15px;
  border: 10px solid rgb(240, 240, 240);
  text-align: center;
  background-color: rgb(255, 255, 255);
}
section div .card li img {
  width: 300px;
  height: 200px;
  margin: 10px auto;
}
section div .card li h3 {
  width: 200px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin: 5px auto;
  line-height: 25px;
  color: rgb(255, 51, 0);
}
section div .card li p{
  line-height: 20px;
  margin: auto;
  width: 300px;
  height: 60px;
  overflow: hidden;
  text-overflow: ellipsis;
  text-indent: 2em;
  -webkit-line-clamp: 5;
}
section div .card li:hover {
  border-color: rgb(255,255,255);
  cursor: pointer;
}
.page ul {
  display: flex;
  justify-content: flex-end;
}
.page ul li {
  margin: 10px 10px;
}
.page ul li span {
  display: block;
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  border-radius: 50%;
  color: #999;
  background-color: rgb(221, 221, 221);
}
.page ul li span:hover {
  cursor: pointer;
  color:rgb(255, 255, 255);
  background-color: rgb(255, 51, 0);
}
.page ul li:nth-child(1) span{
  color:rgb(255, 255, 255);
  background-color: rgb(255, 51, 0);
}
